<template>
    <div class="index-container" style="overflow: hidden">
        <!-- 导航栏 -->
        <div class="stick" ref="stick">
            <indexNavBar
                :title="$route.meta.title"
                @click-left="$router.go(-1)"
            ></indexNavBar>

            <!-- 搜索框 -->
            <div class="index-search">
                <input class="index-search-ipt" type="text" v-model="queryParameter.complexQuery" placeholder="查找车辆">
                <img class="index-search-img" src="../../assets/search.png"  @click="handleRefresh">
            </div>
        </div>

        <!-- 下拉刷新 && 上拉加载 -->
        <pullList ref="pullList" :style="pullHeight"  @refresh="handleRefresh" @load="initList">
            <indexListNone
                v-if="list.length == 0"
                :imgUrl="require('../../assets/team/auto-none.png')"
                :prompt="'未能搜索到该车辆'"
            />

            <template v-for="(item, index) in list">
                <autoCard
                    :key="index"
                    :class="{'index-card-last': index + 1 == list.length}"
                    :cardInfo="item"
                ></autoCard>
            </template>
        </pullList>
    </div>
</template>

<script>
import pullList from '../../components/pull-list/pull-list.vue'
import indexNavBar from '../../components/style/index-nav-bar.vue'
import indexListNone from '../../components/style/index-list-none.vue'
import autoCard from './components/auto-card.vue'

export default {
    components: {
        pullList,
        indexNavBar,
        indexListNone,
        autoCard
    },
    data () {
        return {
            loading: false,
            queryParameter: {
                complexQuery: '',
                autoTeamNo: this.$store.state.selTeam.teamNo,
                pageSize: 10,
                pageNum: 0
            },
            list: [],
            pullHeight: ''
        }
    },
    mounted () {
        let height = this.$refs.stick.offsetHeight + 25
        this.pullHeight = 'height: calc(100% - ' + height + 'px)'
        this.hideItem()
        this.init()
    },
    methods: {
        /* 初始化 */
        init () {
            this.initList()
        },

        /* 下拉刷新 */
        handleRefresh () {
            this.queryParameter.pageNum = 0
            this.$refs.pullList.finished = false
            this.initList()
        },

        /* 初始化接口 */
        /* 初始化接口 */
        async initList () {
            if (this.loading) {
                return
            }

            let _ = this
            this.loading = true

            const res = await _.$H.get(_, _.$A.team.appCarList, _.queryParameter)
            console.log('auto', res)
            // 数据异常
            if (res.status != 200) {
                return
            }
            let rows = res.data
            // 加载结束
            if (rows == null || rows.length == 0) {
                _.$refs.pullList.finished = true
            }
            // 最后一页
            if (rows.length < _.queryParameter.pageSize) {
                _.$refs.pullList.finished = true
            }
            // 数据处理
            if (_.queryParameter.pageNum === 0) {
                _.list = rows
                if (rows.length === 0) {
                    _.finishedText = '暂无相关数据'
                }
            } else {
                _.list = _.list.concat(rows)
            }
            _.queryParameter.pageNum++
            _.loading = false
            _.$refs.pullList.loading = false
            _.$refs.pullList.refreshing = false
        }
    }
}
</script>

<style lang="less" scoped>
.auto-content {
    height: calc(100% - 220px);
}
</style>
